<%@page import="java.text.DateFormat"%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="java.util.List" %>
<%@ page import="com.google.appengine.api.users.User" %>
<%@ page import="java.security.MessageDigest"%>
<%@ page import="java.security.NoSuchAlgorithmException"%>
<%@ page import="java.util.Date"%>
<%@ page import="com.google.appengine.api.users.UserService" %>
<%@ page import="com.google.appengine.api.users.UserServiceFactory" %>
<%@ page import="com.google.appengine.api.datastore.DatastoreServiceFactory" %>
<%@ page import="com.google.appengine.api.datastore.DatastoreService" %>
<%@ page import="com.google.appengine.api.datastore.Cursor" %>
<%@ page import="com.google.appengine.api.datastore.Query" %>
<%@ page import="com.google.appengine.api.datastore.Entity" %>
<%@ page import="com.google.appengine.api.datastore.FetchOptions" %>
<%@ page import="com.google.appengine.api.datastore.Key" %>
<%@ page import="com.google.appengine.api.datastore.KeyFactory" %>
<%@ page import="com.google.appengine.api.datastore.QueryResultList" %>
<%@ page import="com.google.appengine.api.datastore.Query.Filter" %>
<%@ page import="com.google.appengine.api.datastore.Query.FilterOperator" %>
<%@ page import="com.google.appengine.api.datastore.Query.FilterPredicate" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>


<!DOCTYPE html>
<html>
<head>
  <link type="text/css" href="css/smoothness/jquery-ui-1.9.1.custom.css" rel="stylesheet" />
  <script src="js/jquery-1.8.2.js"></script>
  <script src="js/jquery-ui-1.9.1.custom.js"></script>
  <script src="palm.js"></script>
  <style>
  	.body{
  		margin: 0px;
  	}
  	.header{
  		background-color: #666666;
  		color: #ffffff;
  	}
  	.header #heading{
  		font-size:60px;
  		font-family:arial;
  		padding: 8px 12px;
  	}
  	.content{
  		margin-left: 10px;
  		margin-right:10px;
  		margin-top:10px;
  		margin-bottom: 10px;
  	}
  	.apost{
  		background-color: #666666;
  		color: #000000;
  		margin:5px, 5px;
  	}
  	.apost p,h1 {
  		color: #ffffff;
  	}
  	.footer{
  		background-color: #666666;
  		color: #ffffff;
  		position:relative;
  		height: 20px;
  		margin-top: -20px;
  		clear:both;
  	}
  </style>
</head>

<body leftmargin="0px" topmargin="0px" marginwidth="0px" marginheight="0px">
<div class="header">
	<div id="heading">
		Vote! Yes/No
	</div>
</div><!-- header -->
<%
	UserService userService = UserServiceFactory.getUserService();
	User user = userService.getCurrentUser();
	if (user == null) {
        response.sendRedirect(userService.createLoginURL(request.getRequestURI()));
    }
	
	int pageLimit = 5;
	DatastoreService datastore = DatastoreServiceFactory.getDatastoreService();
    FetchOptions fopt = FetchOptions.Builder.withLimit(pageLimit);

	String theCur = request.getParameter("p");
	if(theCur!=null)
		fopt.startCursor(Cursor.fromWebSafeString(theCur));
	
    Query query = new Query("Post").setFilter(new FilterPredicate("valid",FilterOperator.EQUAL,"1"))
   	.addSort("date", Query.SortDirection.DESCENDING);
    
    QueryResultList<Entity> posts = datastore.prepare(query).asQueryResultList(fopt);
    
%>
<div id="msg"> </div>
<div id="userid" name="<%= user.getUserId() %>"></div>

<div class="content">

<div id="newvote">New Vote</div>
<div id="pastvotes">Past Votes</div>

<div id="allVote">
	<% 
		if(posts.isEmpty()){ 
	%> 
			<p>no voting now</p>
	<%
		}else{
	%>
			<h4>Hot Topic Today:</h4>
	<% 
			for(Entity post: posts ){
				Date createTime = (Date) post.getProperty("date");
				Long tlimit = (Long) post.getProperty("timelimit");
				Long thislimit = createTime.getTime()+tlimit - new Date().getTime();
				
	%>
					<div class="apost" id="post-<%= post.getKey() %>">
						<h1><%= post.getProperty("topic")%></h1>
	<%
						if(!post.getProperty("img1").equals("null")){
	%>
						<img height="300" src="/votepost?blob-key=<%=post.getProperty("img1")%>"/>
	<%
						}
						if(!post.getProperty("img2").equals("null")){
	%>
						<img height="300" src="/votepost?blob-key=<%=post.getProperty("img2")%>"/>
	<%
						}
	%>
						<p>Yes: <%= post.getProperty("yes") %> No: <%= post.getProperty("no") %></p>
						<div>
							<input class="votebu" type="submit" name="voteyes" id="<%= KeyFactory.keyToString(post.getKey()) %>" value="Yes" />
        					<input class="votebu" type="submit" name="voteno" id="<%= KeyFactory.keyToString(post.getKey())%>"  value="No"/>
    					</div>
    					<p class="remaint" t="<%=thislimit%>">Remaining Time: </p>
    					<hr>
					</div>
	<%
			}
			if(posts.size()>=pageLimit){
	%>
				<a href="/?p=<%= posts.getCursor().toWebSafeString() %>">Next page</a>
	<%
			}
		}
	%>
	<br><br>
</div><!-- allVote -->
</div><!-- content -->
</body>
<div class="footer">
	<center>
		CopyRight (C) 2012 Alvin Hon, alvin.cpp@gmail.com
	</center>
</div>

</html>